<template>
  <section class="XgPlayer">
    西瓜播放器
    <div id="xg" class="player"></div>
    <div id="xg2" class="player"></div>
    <div id="xg3" class="player"></div>
    <div id="xg4" class="player"></div>
  </section>
</template>

<script>
// import "xgplayer";
import "../assets/xgplayer";
import FlvPlayer from "../assets/xgplayer-flv";
import FlvJsPlayer from "xgplayer-flv.js";

// new FlvPlayer({
//   el: document.getElementById('xg'),
//   url: "//sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-360p.flv",
//   isLive: true,
//   playsinline: true,
//   height: window.innerHeight,
//   width: window.innerWidth,
// });
export default {
  naem: "XgPlayer",

  mounted() {
    new FlvJsPlayer({
      el: document.getElementById("xg"),
      url: "http://192.168.13.228:31333/video?onlineNo=10006987215&ch=1&datatype=1&stream=1&access_token=eyJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOiIxIiwidGVuYW50X25hbWUiOiLljqbpl6jmtbfmsqflhazkuqTpm4blm6IiLCJ1c2VyX25hbWUiOiJ4bWhjIiwidGVuYW50X2RldmljZV9ubyI6IjEwMDAiLCJwZXJzb25fbmFtZSI6IueuoeeQhuWRmCIsImNsaWVudF9pZCI6bnVsbCwiY2xpZW50X2FjY291bnQiOm51bGwsInVzZXJfdHlwZSI6MSwidXNlcl9pZCI6IjIiLCJvcmdfaWQiOiIxIiwib3JnX25hbWUiOiLmgLvliIbnu4QiLCJleHAiOjE2Mjk3MDI3NTAsImNsaWVudF9uYW1lIjpudWxsLCJ0ZW5hbnRfY29kZSI6InhtaGMifQ.hyPCwVWcLrYv1z3sr5JXSsSPOPUku5tFZ1td2uMyMdM ",
      isLive: true,
      hasAudio: false,
      playsinline: true,
      // height: 400,
      // width: 600,
      flvOptionalConfig: {
        enableWorker: true,
      }, //flv.js可选配置项
    });
    // new FlvPlayer({
    //   el: document.getElementById("xg"),
    //   url: "//sf1-cdn-tos.huoshanstatic.com/obj/media-fe/xgplayer_doc_video/flv/xgplayer-demo-720p.flv",
    //   isLive: true,
    //   playsinline: true,
    //   height: 400,
    //   width: 600,
    //   controls: false
    // });
    // new FlvPlayer({
    //   el: document.getElementById("xg"),
    //   url: "http://192.168.13.228:31333/video?onlineNo=10006987229&ch=1&datatype=1&stream=1&access_token=eyJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOiIxIiwidGVuYW50X25hbWUiOiLljqbpl6jmtbfmsqflhazkuqTpm4blm6IiLCJ1c2VyX25hbWUiOiJ4bWhjIiwidGVuYW50X2RldmljZV9ubyI6IjEwMDAiLCJwZXJzb25fbmFtZSI6IueuoeeQhuWRmCIsImNsaWVudF9pZCI6bnVsbCwiY2xpZW50X2FjY291bnQiOm51bGwsInVzZXJfdHlwZSI6MSwidXNlcl9pZCI6IjIiLCJvcmdfaWQiOiIxIiwib3JnX25hbWUiOiLmgLvliIbnu4QiLCJleHAiOjE2Mjk3MDEyNDcsImNsaWVudF9uYW1lIjpudWxsLCJ0ZW5hbnRfY29kZSI6InhtaGMifQ.umBrGS4qs4gTKp8lPJjVDpuSVtwXGmYQ-UR58KSWaPQ",
    //   isLive: true,
    //   hasAudio: false,
    //   playsinline: true,
    //   height: 400,
    //   width: 600,
    // });
    //   new FlvPlayer({
    //     el: document.getElementById("xg2"),
    //     url: "http://192.168.13.228:31333/video?onlineNo=10006987215&ch=1&datatype=1&stream=1&access_token=eyJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOiIxIiwidGVuYW50X25hbWUiOiLljqbpl6jmtbfmsqflhazkuqTpm4blm6IiLCJ1c2VyX25hbWUiOiJ4bWhjIiwidGVuYW50X2RldmljZV9ubyI6IjEwMDAiLCJwZXJzb25fbmFtZSI6IueuoeeQhuWRmCIsImNsaWVudF9pZCI6bnVsbCwiY2xpZW50X2FjY291bnQiOm51bGwsInVzZXJfdHlwZSI6MSwidXNlcl9pZCI6IjIiLCJvcmdfaWQiOiIxIiwib3JnX25hbWUiOiLmgLvliIbnu4QiLCJleHAiOjE2Mjk0NTIzMjQsImNsaWVudF9uYW1lIjpudWxsLCJ0ZW5hbnRfY29kZSI6InhtaGMifQ.R6ZyOHoachidYipwo1hgouZ1qyV4uKR4RFzedoifEIU",
    //     isLive: true,
    //     playsinline: true,
    //     height: 400,
    //     width: 600,
    //   });
    //   new FlvPlayer({
    //     el: document.getElementById("xg3"),
    //     url: "http://192.168.13.228:31333/video?onlineNo=10006987243&ch=11&datatype=1&stream=1&access_token=eyJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOiIxIiwidGVuYW50X25hbWUiOiLljqbpl6jmtbfmsqflhazkuqTpm4blm6IiLCJ1c2VyX25hbWUiOiJ4bWhjIiwidGVuYW50X2RldmljZV9ubyI6IjEwMDAiLCJwZXJzb25fbmFtZSI6IueuoeeQhuWRmCIsImNsaWVudF9pZCI6bnVsbCwiY2xpZW50X2FjY291bnQiOm51bGwsInVzZXJfdHlwZSI6MSwidXNlcl9pZCI6IjIiLCJvcmdfaWQiOiIxIiwib3JnX25hbWUiOiLmgLvliIbnu4QiLCJleHAiOjE2Mjk0NTA5MTQsImNsaWVudF9uYW1lIjpudWxsLCJ0ZW5hbnRfY29kZSI6InhtaGMifQ.l5H2FH1eJqnd-Hmb8cqNN6c1iaqbstiGmKl-YpZpBec",
    //     isLive: true,
    //     playsinline: true,
    //     height: 400,
    //     width: 600,
    //   });
    //   new FlvPlayer({
    //     el: document.getElementById("xg4"),
    //     url: "http://192.168.13.228:31333/video?onlineNo=10006987243&ch=10&datatype=1&stream=1&access_token=eyJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOiIxIiwidGVuYW50X25hbWUiOiLljqbpl6jmtbfmsqflhazkuqTpm4blm6IiLCJ1c2VyX25hbWUiOiJ4bWhjIiwidGVuYW50X2RldmljZV9ubyI6IjEwMDAiLCJwZXJzb25fbmFtZSI6IueuoeeQhuWRmCIsImNsaWVudF9pZCI6bnVsbCwiY2xpZW50X2FjY291bnQiOm51bGwsInVzZXJfdHlwZSI6MSwidXNlcl9pZCI6IjIiLCJvcmdfaWQiOiIxIiwib3JnX25hbWUiOiLmgLvliIbnu4QiLCJleHAiOjE2Mjk0NTA5MTQsImNsaWVudF9uYW1lIjpudWxsLCJ0ZW5hbnRfY29kZSI6InhtaGMifQ.l5H2FH1eJqnd-Hmb8cqNN6c1iaqbstiGmKl-YpZpBec",
    //     isLive: true,
    //     playsinline: true,
    //     height: 400,
    //     width: 600,
    //   });
  },
};
</script>

<style lang="scss" scoped>
.XgPlayer {
  .player {
    display: inline-block;
  }
}
</style>